{% extends "base.html" %}
{% load static %}

{% block title %}
    文章详情
{% endblock title %}

{% block content %}
<div class="container">
    <div class="row">
        <div class="col-9">
            <h1 class="col-12 mt-4 mb-4">{{ article.title }}</h1>
        
            <div class="col-12 alert alert-success">
                作者:{{ article.author }}
                <!-- <a href="{% url "article:article_delete"  article.id %}">删除</a>-->
                {% if user == article.author %}
                · <a href="#" onclick="confirm_delete()">删除</a>
                · <a href="{% url "article:article_update" article.id %}">编辑</a>
                {% endif %}
                <div>
                    浏览: {{ article.total_views }}
                </div>
            </div>
           
            <div class="col-12">
                <p>{{ article.body|safe }}</p>
            </div>
        

        <!--发表评论-->
        <hr>
        {% if user.is_authenticated %}
            <div>
                <form action="{% url 'comment:post_comment' article.id %}" method="POST">
                {% csrf_token %}
                <div class="form-group">
                    <label for ="body">
                        <strong>
                            我要发言:
                        </strong>
                    </label>
                    <textarea type="text" class="form-control" id="body" name="body" rows="2"></textarea>
                </div>
                <button type="submit" class="btn btn-primary">发送</button>
            </form>
            </div>
            <br>
        {% else %}
            <br>
            <h5 class="row justify-content-center">
                请<a href="{% url 'userprofile:login' %}">登录</a>后回复
            </h5>
            <br>
        {% endif %}
        <h4>共有{{comments.count}}条评论</h4>
        <div>
            {% for comment in comments %}
            <hr>
            <p>
                <strong style="color:pink">
                    {{comment.user}}
                </strong> 于
                <span style="color:green">
                    {{ comment.created|date:"Y-m-d H:i:s"}}
                </span>时说:
            </p>
            <pre style="font-family: inherit; font-size:1em;">{{comment.body}}</pre>
            {% endfor %}
        </div>
    </div>
        <div class="col-3 mt-4">
            <h4><strong>目录</strong></h4>
            <hr>
            <div>
                {{ toc| safe }}
            </div>
        </div>
    </div>
</div>
<script>
    function confirm_delete(){
        layer.open({
            title:"主公,请三思",
            content:"确认删除这篇文章么?",
            yes:function(index,layero){
                location.href='{% url "article:article_delete" article.id %}'
            },
        })
    }
</script>
{% endblock content %}
